<wicket:panel>
	<div class="commit-list card">
		<div class="card-body">
			<form wicket:id="query" class="clearable-wrapper mb-4">
				<div class="input-group">
					<input wicket:id="input" spellcheck="false" autocomplete="off" class="form-control" placeholder="Query commits. Hit space to show syntax helper">
					<span class="input-group-append">
						<button wicket:id="submit" type="submit" class="btn btn-outline-secondary btn-icon" title="Query"><wicket:svg href="magnify" class="icon"></wicket:svg></button>
					</span>
				</div>
			</form>
			<div class="mb-4">
				<a wicket:id="showSavedQueries" class="show-saved-queries text-gray d-inline-block mb-2 mr-4">
					<wicket:svg href="eye" class="icon"></wicket:svg> Show Saved Queries
				</a>
				<a wicket:id="saveQuery" class="save-query text-gray d-inline-block mb-2 mr-4">
					<wicket:svg href="save" class="icon"></wicket:svg> Save Query
				</a>
			</div>
	        <div wicket:id="body" class="body resize-aware">
	            <div wicket:id="feedback"></div>
	            <ul class="list list-unstyled">
	                <li wicket:id="commits" class="d-flex align-items-start"></li>
	            </ul>
	            <div wicket:id="noCommits" class="no-commits"></div>
	        </div>
	        <div wicket:id="foot" class="foot text-center">
	            <a wicket:id="more" class="btn btn-primary">More commits</a>
	            <div wicket:id="tooMany" class="mt-4 mb-0 alert alert-light-warning">Too many commits to load</div>
	        </div>
		</div>
	</div>
	<wicket:fragment wicket:id="commitFrag">
		<div class="avatar mr-3">
			<span wicket:id="avatar"></span>
		</div>
		<div class="detail mt-n1">
			<div class="message-and-labels d-flex align-items-start flex-wrap">
				<div wicket:id="message" class="message mr-3"></div>
				<div class="labels">
					<wicket:container wicket:id="labels">
						<span wicket:id="label" class="badge badge-info badge-sm mr-2"></span>
					</wicket:container>
				</div>
			</div>
			<div wicket:id="contribution"></div>
		</div>
		<div class="actions d-flex ml-auto">
			<span class="btn-group mr-2">
			<a wicket:id="signature" class="btn btn-outline-secondary"></a>
	        <a wicket:id="buildStatus" class="build-status btn btn-outline-secondary"></a>
			</span>
	        <span class="btn-group hash mr-2 d-none d-xl-flex">
	            <a wicket:id="hashLink" class="btn btn-outline-secondary hash"><span wicket:id="hash"></span></a>
	            <a wicket:id="copyHash" class="btn btn-outline-secondary btn-icon"><wicket:svg href="copy" class="icon"></wicket:svg></a>
	        </span>
	        <span class="btn-group browse">
	            <a wicket:id="browseCode" title="Browse code" class="btn btn-outline-secondary btn-icon"><wicket:svg href="files" class="icon"></wicket:svg></a>
	            <wicket:enclosure>
	            <a wicket:id="compare" class="compare btn btn-outline-secondary btn-icon" title="Compare with base revision"><wicket:svg href="diff" class="icon"></wicket:svg></a>
	            </wicket:enclosure>
	        </span>
		</div>
	</wicket:fragment>
	<wicket:fragment wicket:id="dateFrag">
		<wicket:svg href="calendar" class="icon icon-lg mr-2"></wicket:svg> <span wicket:id="date"></span>
	</wicket:fragment>
</wicket:panel>